<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<link rel="stylesheet" href="./css/2022-8-9/2022-8-9.css">

<body>
    <header>
        蒙古海军高层联合会议室
    </header>
    <main>
        <div class="right">
            <img src="./images/12.png" alt="">
            <p>
                nihaomaaaaa
            </p>
        </div>
        <div class="left">
            <img src="./images/12.png" alt="">
            <p>
                nihaomaaaaa
            </p>
        </div>
    </main>
    <footer>
        <input type="text" name="" id="inp">
        <button class="but">send</button>
    </footer>
</body>
<script>
    var input = document.querySelector("#inp");
    var but = document.querySelector(".but");
    var socket = new WebSocket("ws://192.168.110.174:4080");
    var str = "";

    socket.onopen = function () {
        console.log("聊天室已开启")
    }
    but.onclick = function () {
        socket.send(JSON.stringify({
            name: '郭子豪',
            img: "~~~",
            msg: input.value,
            Time: formationTime()
        }))
        input.innerText = null;
        input.value = null;
    }
    document.onkeydown = function (e) {
        if (e.keyCode == 13) {
            but.click();
        }
    }
    socket.onclose = function () {
        console.log("退出聊天室");
        socket.close;
    }
    //处理时间

    function formationTime() {
        var pp;
        var date = new Date();
        pp = `${date.getDate()}${date.getTime()}`
        return pp;
    }

    socket.onmessage = function (e) {
        console.log(e.data);
        var data = JSON.parse(e.data);
        console.log(data);
    }

    Date.prototype.format = function (fmt) {
        var o = {
            "M+": this.getMonth() + 1, //月份 
            "d+": this.getDate(), //日 
            "H+": this.getHours(), //小时 
            "h+": this.getHours() > 12 ? this.getHours() - 12 : this.getHours(), //小时 
            "m+": this.getMinutes(), //分 
            "s+": this.getSeconds(), //秒 
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
            "S": this.getMilliseconds() //毫秒 
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp
            .$1
            .length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length ==
                    1) ?
                (o[k]) :
                (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }
</script>

</html>